<div class="max-w-4xl mx-auto sm:px-6 lg:px-8 mt-8 sm:mt-16">
  <div class="bg-white sm:shadow sm:overflow-hidden sm:rounded-lg">
    <div class="px-4 py-5 sm:px-6">
      <div class="flex items-start justify-between">
        <div>
          <h3 class="text-lg leading-6 font-medium text-gray-900"><%= t("hiring_agreements.signatures.new.title") %></h3>
          <p class="mt-1 text-sm text-gray-500"><%= t("hiring_agreements.signatures.new.description", last_updated: @term.created_at.to_formatted_s(:calendar)) %></p>

          <% if @signature.present? %>
            <div class="mt-2 font-medium text-gray-900 bg-yellow-50 px-3 py-1 rounded -ml-3">
              <%= t(".signed_on", date: @signature.created_at.to_formatted_s(:calendar)) %>
              <% if @signature.full_name.present? %>
                <%= t(".signed_by", name: @signature.full_name) %>
              <% end %>
            </div>
          <% end %>
        </div>

        <% if @signature&.signed_pdf&.attached? %>
          <%= button_to rails_blob_url(@signature.signed_pdf, disposition: "download"), method: :get, class: "inline-flex items-center gap-x-1.5 rounded-md bg-gray-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-gray-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600" do %>
            <%= inline_svg_tag "icons/solid/download.svg", class: "-ml-0.5 h-5 w-5" %>
            <%= t(".download") %>
          <% end %>
        <% end %>
      </div>
    </div>

    <div class="bg-white border-t border-gray-200 px-4 py-5 sm:px-6">
      <div class="prose max-w-none">
        <%= simple_format @term.body %>
      </div>
    </div>
  </div>

  <p class="mt-8 px-6 prose"><%= t("hiring_agreements.signatures.new.questions_html") %></p>
</div>
